<ion-header [translucent]="true">
  <ion-toolbar>
    <ion-title style='text-align:center'> 
      我的
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content [fullscreen]="true">
  <ion-list>
    <ion-item  [routerLink]="['/user-info']">
      <ion-thumbnail slot="start">
        <img src="/assets/img/course.jpg">
      </ion-thumbnail>
      <ion-label>
        <h3>
          {{pName}}
        </h3>
        <p>
          {{pNumber}}
        </p>
      </ion-label>
    </ion-item>
    <ion-item>
      <ion-grid>
        <ion-row>
          <ion-col>
            <ion-button [routerLink]="['/unopen']" fill="clear" style="padding-inline-start:12%">
              <ion-icon name="pie-chart-outline" size="large"></ion-icon>
            </ion-button>
          </ion-col>
          <ion-col>
            <ion-button [routerLink]="['/unopen']" fill="clear"  style="padding-inline-start:14%">
              <ion-icon name="cube-outline" size="large"></ion-icon>
            </ion-button>
          </ion-col>
          <ion-col>
            <ion-button [routerLink]="['/unopen']" fill="clear" style="padding-inline-start:14%">
              <ion-icon slot="icon-only" name="heart-outline" size="large"></ion-icon>
            </ion-button>
          </ion-col>
        </ion-row>
        <ion-row>
          <ion-col>
            <ion-label style="padding-left: 5%;">我的空间</ion-label>
          </ion-col>
          <ion-col>
            <ion-label style="padding-left: 8%;">我的收藏</ion-label>
          </ion-col>
          <ion-col>
            <ion-label style="padding-left: 10%;">心意卡片</ion-label>
          </ion-col>
        </ion-row>
      </ion-grid>
    </ion-item>
    <ion-item [routerLink]="['/to-friend']">分享给朋友</ion-item>
    <ion-item [routerLink]="['/setting']">设置</ion-item>
  </ion-list>
</ion-content>
